<template>
  <div class="saleReport">
    <jc-title />
    <el-tabs v-model="activeName">
      <el-tab-pane v-if="false" name="purchaseHz" label="惠州采购报表">
        <purchaseHz />
      </el-tab-pane>
      <el-tab-pane name="packingPrice" :label="$t('market.bczdjj')">
        <packingPrice />
      </el-tab-pane>
      <el-tab-pane name="materialPurchase" :label="$t('market.clcg')">
        <materialPurchase />
      </el-tab-pane>
      <el-tab-pane :label="$t('market.procureDealWith')" name="procureDealWith">
        <procureDealWith />
      </el-tab-pane>
      <el-tab-pane :label="$t('market.cgjmyl')" name="purchaseDemand">
        <purchaseDemand height="calc(100vh - 230px)" />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
export default {
  name: 'PurchasingReport',
  components: {
    purchaseDemand: () => import('@/views/homePageNew/buyerHome/component/purchaseDemand'),
    procureDealWith: () => import('@/views/financial/statements/procureDealWith'),
    purchaseHz: () => import('@/views/purchasing/purchase/baoBiao/purchaseHz'),
    materialPurchase: () => import('@/views/purchasing/purchase/baoBiao/materialPurchase'),
    packingPrice: () => import('@/views/purchasing/purchase/baoBiao/packingPrice')
  },
  data() {
    return {
      activeName: 'packingPrice' // tab name
    }
  }
}
</script>

<style scoped lang="scss">
.saleReport {
  @include listBom;
  position: relative;
  .el-tabs::v-deep .el-tabs__nav-next,
  .el-tabs::v-deep .el-tabs__nav-prev {
    line-height: 28px;
    font-size: 14px;
  }
}
</style>
